// routers.js
import { lazy } from "react";
const Layout = lazy(() => import("@/layout/index.tsx"));
const Home = lazy(() => import("@/pages/home/index.tsx"));
const Selected = lazy(() => import("@/pages/selected/index.tsx"));
const My = lazy(() => import("@/pages/my/index.tsx"));
const VideoDetail = lazy(() => import("@/pages/videoDetail/index.tsx"));
const NotAcc = lazy(() => import("@/pages/notAcc/index.tsx"));

import { Navigate } from "react-router-dom";
import { Suspense } from "react";

const myRoutes = [
  {
    path: "/",
    element: <Layout />,
    children: [
      {
        path: "/", // 基础路径，为空表示默认子路由
        element: <Navigate to="/home" />, // 默认重定向到"/home"
      },
      {
        path: "home", // 子路由路径
        element: (
          <Suspense fallback={"加载中"}>
            <Home />
          </Suspense>
        ), // 子路由对应的组件
      },
      {
        path: "selected",
        element: (
          <Suspense fallback={"加载中"}>
            <Selected />
          </Suspense>
        ),
      },
      {
        path: "my",
        element: (
          <Suspense fallback={"加载中"}>
            <My />
          </Suspense>
        ),
      },
    ],
  },
  {
    path: "/videodetail/:id", // 根路由
    element: <VideoDetail />, // 默认重定向到"/layout"
  },
  {
    path: "*", // 根路由
    element: <NotAcc />, // 默认重定向到"/layout"
  }
];

export default myRoutes;
